import 'package:flutter/material.dart' ;
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:webview_flutter/webview_flutter.dart';


class WebViewByUrl extends StatefulWidget {
  String url ;

  WebViewByUrl({Key key , @required this.url}):super(key:key) ;

  @override
  _WebViewByUrlState createState() => _WebViewByUrlState();
}

class _WebViewByUrlState extends State<WebViewByUrl> {

  WebViewController _controller ;
  bool loading = true ;
  double schedule = 0.0 ;

  @override
  Widget build(BuildContext context) {
    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: SystemUiOverlayStyle.light,
      child: WillPopScope(
        child: Scaffold(
          body: Stack(
            children: <Widget>[
              Column(
                children: <Widget>[
                  Container(
                    height: MediaQuery.of(context).padding.top ,
                    color: Color.fromARGB(80, 0, 0, 0),
                  ) ,
                  Expanded(
                    child: WebView(
                      initialUrl: widget.url ,
                      javascriptMode: JavascriptMode.unrestricted ,
                      onWebViewCreated: (c){
                        _controller = c ;
                      },
                      onPageFinished: (a){
                        setState(() {
                          loading = false ;
                        });
                        schedule = 1 ;
                      },
                      javascriptChannels: <JavascriptChannel>[
                        JavascriptChannel(
                          name: 'mfkb_back' ,
                          onMessageReceived: (JavascriptMessage message) {
                            print("pop") ;
                            Navigator.of(context).pop() ;
                          }
                        )
                      ].toSet(),
                    ) ,
                  )
                ],
              ) ,
              Visibility(
                visible: loading ,
                child: Container(
                    width: ScreenUtil().setWidth(375),
                    height: ScreenUtil().setHeight(812),
                    color: Color.fromARGB(255, 236, 237, 241),
                    child: Center(
                      child: Container(
                        height: 44 ,
                        child: Column(
                          children: <Widget>[
                            SizedBox(
                              child: CircularProgressIndicator(
                                backgroundColor: Colors.grey.withOpacity(0.2) ,
                                valueColor: AlwaysStoppedAnimation(Colors.grey) ,
                              ),
                              height: 44.0,
                              width: 44.0,
                            ) ,
                          ],
                        ),
                      ),
                    ),
                  )
              )
            ],
          ),
        ),
        onWillPop: () async{
          if(_controller == null){
            return true ;
          }else{
            bool canBack = await _controller.canGoBack() ;
            if(canBack){
              _controller.goBack() ;
            }else{
              return true ;
            }
          }
        },
      ),
    );
  }
}